<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="ctx" scope="page" value="${request.contextPath}" />
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE  >
<html >
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
    <title>工单信息</title>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/weui/1.1.2/weui-for-work.min.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/jquery-weui/css/jquery-weui.min.css">
    <script type="text/javascript" src="${ctx}/static/jquery/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/weui/1.1.2/weui.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/weixin/wx_common.js"></script>
    <!-- 企业微信的JS-SDK -->
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <style type="text/css">
        .preview-img{
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            background-color: #000000;
            z-index: 1000;
        }
        .preview-img img{
            top: 50%;
            left: 50%;
            position: absolute;
            transform: translate(-50%,-50%);
        }
    </style>
</head>
<body style="background-color: #f8f8f8" >
<div class="page">
<div class="page__bd">
    <input type="hidden" name="userId" id="userId" value="${userId}"/>
    <div id="appendHtml">

    </div>

<div class="weui-loadmore" id="loading">
    <i class="weui-loading"></i>
    <span class="weui-loadmore__tips">正在加载</span>
</div>
<script type="text/javascript" src="${ctx}/static/weixin/allocation_repaire.js" ></script>
<script type="text/javascript" src="${ctx}/static/jquery-weui/js/jquery-weui.min.js" ></script>
<script>
    $(function () {
        var loading = false;  //状态标记 这个变量主要是用来控制触发次数，官网也有说明，事件可能会触发多次
        // var userId = getQueryVariable("userId");
        // $("#userId").val(userId);
        $(document.body).infinite().on("infinite", function() {
            $("#loading").css("display","block");//显示 加载中图标
            if(loading) return;
            loading = true;
            if(page<=countPage){//如果当前页小于总页面
                getbalancelist();
            }else{
                $(document.body).destroyInfinite();//到最后一页时，销毁它
                $("#loading>i").css("display","none");
                $("#loading>span").html("到底啦~").css("color","#BDBDBD");
            }
        });
        var countPage=1;//总页数
        var page=1;//当前页
        var pageSize=8;//每页显示几条
        getbalancelist();
        //获取数据
        function getbalancelist(){
            $.ajax({
                url:ctx + "/weixin/allocation/searchCycle?userId="+$("#userId").val()+"&page="+page+"&rows="+pageSize,
                method:'get',
                dataType:'json',
                async:false,
                success:function(res){
                    //这里计算出总页数。。一般是后台给的
                    countPage=Math.ceil((res.data.total)/pageSize);
                    //处理数据部分 .......
                    appendDataHtml(res.data.rows);
                    loading = false;//会多次触发，所以 需要请求完成数据 才能继续触发

                    $("#loading").css("display","none");//数据加载完隐藏加载提示
                }
            })
            page++;
        }
        function appendDataHtml(data) {
            if(data.length>0){
                var html = "";
                $.each(data,function (i,v) {
                    html +="<div class=\"weui-form-preview\"><div class=\"weui-form-preview__bd\">";
                    html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">报修人</label><span class=\"weui-form-preview__value\">"+v.creatorName+"</span></div>";
                    html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">部门</label><span class=\"weui-form-preview__value\">"+v.callerDeptName+"</span></div>";
                    html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">地址</label><span class=\"weui-form-preview__value\">"+v.address+"</span></div>";
                    html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">选项</label><span class=\"weui-form-preview__value\">"+v.machineType+"</span></div>";
                    html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">判断常用</label><span class=\"weui-form-preview__value\">"+v.repaireSubject+"</span></div>";
                    html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">备注</label><span class=\"weui-form-preview__value\">"+v.description+"</span></div>";
                    html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">创建时间</label><span class=\"weui-form-preview__value\">"+v.createTime+"</span></div>";
                    html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">派单时间</label><span class=\"weui-form-preview__value\">"+v.assignTime+"</span></div>";
                    html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">接单时间("+v.currentName+")</label><span class=\"weui-form-preview__value\">"+v.acceptTime+"</span></div>";
                    if(v.allocationVOList !=null && v.allocationVOList.length>0){
                        $.each(v.allocationVOList,function (index,value) {
                            html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">转单时间</label><span class=\"weui-form-preview__value\">"+value.allocationTime+"</span></div>";
                            html +="<div class=\"weui-form-preview__item\"><label class=\"weui-form-preview__label\">转单工程师</label><span class=\"weui-form-preview__value\">"+value.creatorName+"</span></div>";
                        })
                    }
                    html+="</div></div><br/>"
                });
                $("#appendHtml").append(html);
            }
        }



        popState();

        var needRefresh = sessionStorage.getItem("need-refresh");
        if(needRefresh){
            sessionStorage.removeItem("need-refresh");
            location.reload();
        }

        function getQueryVariable(variable)
        {
            var query = window.location.search.substring(1);
            var vars = query.split("&");
            for (var i=0;i<vars.length;i++) {
                var pair = vars[i].split("=");
                if(pair[0] == variable){return pair[1];}
            }
            return(false);
        }
    });

    var ctx = "${ctx}";

</script>
</body>
</html>
